import React, {
    Component,
} from 'react';
import {
    StyleSheet,
    Dimensions,
    Text,
    View,
    TouchableOpacity,
    ImageBackground,
    Image,
    Platform,
    TextInput,
    Switch
} from 'react-native';

export default class PublishCarSwitch extends Component {

    constructor(props) {
        super(props);
        this.state = {
            switchcolor: {
                false: '#e4e4e4',
                true: '#30bf47',
            },
        }
    };

    componentDidMount() {

    }


    render() {
        return (
            <View style={[styles.itemBox, {borderBottomWidth: this.props.hideSepline ? 0:0.3}]}>
                <View style={styles.itemLeftBox}>
                    <Text style={styles.itemTitleText}>
                        {this.props.name}
                    </Text>
                </View>
                <View style={styles.itemRightBox}>
                    <Switch
                        style={{ transform: [{ scaleX: 1.0 }, { scaleY: 1.0 }] }}
                        value={this.props.value == 1 ? true : false}
                        trackColor={this.state.switchcolor}
                        thumbColor='white'
                        onValueChange={(value) => {
                            this.valueChanged();
                        }}
                    >
                    </Switch>
                </View>
            </View>
        )
    }

    valueChanged() {
        if (this.props.valueChanged) {
            this.props.valueChanged(this.props.value ? 0: 1)
        }
    }

}

const styles = StyleSheet.create({
    itemBox: {
        width: '100%',
        height: 45,
        borderBottomColor: '#e4e4e4',
        borderBottomWidth: 0.3,
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between'
    },
    itemLeftBox: {
        width: 100,
    },
    itemRightBox: {
        flex: 1,
        height: '100%',
        marginLeft: 4,
        flexDirection: 'row',
        justifyContent: 'flex-end',
        alignItems: 'center'
    },
    itemTitleText: {
        lineHeight: 19,
        fontSize: 14,
        color: '#222222'
    },

})